<!--
 * @Author: bsj
 * @Date: 2024-11-19
 * @LastEditors: baoshijie baoshijie
 * @LastEditTime: 2024-11-23 19:41:37
 * @Description: 汇率配置
 * @FilePath: \computing-equipment\src\views\costParameterConfiguration\exchangeRate.vue
-->
<template>
    <div class="exchangeRate" v-loading="loading">
        <el-descriptions title="汇率配置" :column="3" :size="size" border>
            <template #title>
                <div class="titleRow">
                    <div>汇率配置</div>
                    <div>
                        <el-button v-show="!edit" type="primary" @click="edit = true">编辑</el-button>
                        <el-button v-show="edit" type="primary" @click="saveAs()">保存</el-button>
                        <el-button v-show="edit" type="" @click="cancel()">取消</el-button>
                    </div>

                </div>
            </template>
            <el-descriptions-item label="美元汇率">
                1USD ≈ <el-input :disabled="!edit" v-model="info.dollar" maxlength="10" style="width: 50%;" />CNY
            </el-descriptions-item>
            <el-descriptions-item label="英镑汇率">
                1GBP ≈ <el-input :disabled="!edit" v-model="info.pound" maxlength="10" style="width: 50%;" />CNY
            </el-descriptions-item>
            <el-descriptions-item label="卢布汇率">
                1RUB ≈ <el-input :disabled="!edit" v-model="info.ruble" maxlength="10" style="width: 50%;" />CNY
            </el-descriptions-item>
        </el-descriptions>
    </div>
</template>
<script setup>
import { ref } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
const loading = ref(false);
const edit = ref(false);
const info = ref({
    dollar: '',
    pound: '',
    ruble: '',
})
const initInfo = ref({
    dollar: '',
    pound: '',
    ruble: '',
})
function getInfo() {
    let data = {
        dollar: '7.2',
        pound: '9.2',
        ruble: '0.0722',
    }
    info.value=data
    initInfo.value=JSON.parse(JSON.stringify(data))
}
function saveAs() {
    loading.value = true
    edit.value = false
    setTimeout(() => {
        loading.value = false
        ElMessage.success('保存成功')
    }, 2000);
}
function cancel() {
    edit.value = false
    info.value=JSON.parse(JSON.stringify(initInfo.value))
}
getInfo()
</script>
<style lang="scss" scoped>
.exchangeRate {
    width: 80%;
}
.titleRow{
    display: flex;
    align-items: center;
    gap: 30px;
}
</style>
